<template>
  <h1>Login</h1>
  <p>
    用户名: <input type="text" v-model="username" placeholder="请输入用户名">
  </p>
  <p>
    密码: <input type="password" v-model="password" placeholder="请输入密码">
  </p>
  <p>
    <button @click="handleLogin()">登录</button>
  </p>
</template>

<script setup>

import {ref } from "vue";
import httpEventEmitter from '../lib/http.js';
import { useRouter } from 'vue-router';

const router = useRouter();

const username = ref('');
const password = ref('');

const handleLogin = async () => {
    if (username.value.length === 0 || password.value.length === 0) {
      return;
    }
    const { token } = await httpEventEmitter.http.post('/login', {
      username: username.value,
      password: password.value
    });
    // 登录成功，将token存入 localStorage
    localStorage.setItem("token", token);
}

</script>

<style scoped>

</style>